<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>上传文件</title>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
    <style>
        .btn_group {
            display: flex;
            flex-direction: row;
            justify-content: space-around;
        }

        .choose_container {
            flex: 1;
            padding: 10px 15px;
            border: 1px solid #e4e4e4;
            border-radius: 6px;
            background-color: #fff;
            color: black;
            /* margin-right: 20px; */
        }

        .upload_container {
            flex: 1;
            padding: 10px 15px;
            border: 1px solid #e4e4e4;
            border-radius: 6px;
            background-color: #01b377;
            color: white;
        }

        input[type='file'] {
            display: none;
        }

        #list_container {
            margin: 20px;
        }
    </style>
</head>

<body>
<div class="box_container">
    <input type="file" name="upfile" id="upfile" />
    <div class="btn_group">
        <button class="choose_container">选择文件</button>
        <!-- <button class="upload_container">上传文件</button> -->
    </div>
    <div id="list_container"></div>
</div>
<script>
    let str = window.location.search.split('=')[1]
    var showtype = str == 98 ? true : false;
    // 文件上传后缀
    var suffixList = [
        'doc',
        'docx',
        'xls',
        'xlsx',
        'ppt',
        'pptx',
        'pdf',
        "png",
        "jpg",
        "jpeg",
        "BMP"
    ];
    // 选择文件
    var chooseBtn = document.getElementsByClassName('choose_container')[0];
    var upIpt = document.getElementById('upfile');
    if (showtype) {
        upIpt.multiple = true
    }
    var list = document.getElementById('list_container');
    chooseBtn.addEventListener('click', function () {
        upIpt.click();
    });
    var upFileList;
    var num = 0
    var postList = [];
    upIpt.addEventListener('change', function (res) {
        upFileList = res.target.files;
        console.log(upFileList.length)
        for (let i = 0; i < upFileList.length; i++) {
            upload(upFileList[i])
        }
        // if (res.target.files.length > 0) {
        //     list.innerText = res.target.files[0].name;
        // }
    });
    // 上传文件
    function upload(data) {
        let fileName = data.name;
        let lastIndexOf = fileName.lastIndexOf('.') + 1;
        //获取文件的后缀名 txt|...
        let suffix = fileName.substring(lastIndexOf);
        if (suffixList.includes(suffix)) {
            let fd = new FormData();
            fd.append('file', data);
            fetch('https://mp.cdsljkj.com/client-api/v1/uploads/uploads', {
                method: 'POST',
                body: fd,
                headers: {},
            }).then((response) => response.json()).then((res) => {
                num++
                console.log(res, data)
                console.log(num, upFileList.length)
                if (num >= upFileList.length) {
                    postList.push({
                        ...res.data,
                        name: fileName
                    })
                    console.log(postList)
                    wx.miniProgram.postMessage({
                        data: postList,
                    });
                    wx.miniProgram.navigateBack({ delta: 1 });
                } else {
                    postList.push({
                        ...res.data,
                        name: fileName
                    })
                }

            }).catch((err) => {
                console.log('fetch error', err);
            });
        } else {
            console.log('文件上传格式不符合要求');
        }
    }
    // var upBtn = document.getElementsByClassName('upload_container')[0];
    // upBtn.addEventListener('click', function () {

    // });
</script>
</body>

</html>